<%@ page language="java" import="java.util.*"
	import="com.gxuwz.medical.domain.family.*"
	import="com.gxuwz.medical.domain.area.*" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="renderer" content="webkit">
<title></title>
<link rel="stylesheet" href="../../css/pintuer.css">
<link rel="stylesheet" href="../../css/admin.css">
<script src="../../js/jquery-1.4.4.min.js"></script>
<script src="../../js/pintuer.js"></script>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%
		String familycode = request.getParameter("familycode");
		familycode = new String(familycode.getBytes("ISO-8859-1"), "UTF-8");
		Family family = new Family();
		Area a = new Area();
		family.setFamilycode(familycode);
		family = family.query();
	%>
<script>
$(function(){
	/*自动选择选项*/
	$("#familyattribute").find("[value =<%=family.getFamilyattribute()%>]").attr("selected","selected");
	$("#town").find("[value =<%=family.getTown()%>]").attr("selected","selected");
	$("#village").find("[value =<%=family.getVillage()%>]").attr("selected","selected");
	$("#group").find("[value =<%=family.getGroup()%>]").attr("selected","selected");
	
	/*绑定change事件*/
	$("#town").change(getvillage);
	$("#village").change(getgroup);
	
});

function getvillage(){
	var areacode = $(this).val();
    console.log(areacode);
    var htmlobj=$.ajax({url:"/medical/system/FamilyServlet?method=getchild&areapcode="+areacode,async:false});
    console.log(htmlobj.responseText);
    var areaArr = JSON.parse(htmlobj.responseText);
    var selected = document.getElementById("village");
    var options =selected.options;
    selected.length=0;
    for(var i=0;i<areaArr.length;i++){
    	document.getElementById("village").options.add(new Option(areaArr[i].areaname,areaArr[i].areacode));
    }
    dispatchEvent("village");
}
function getgroup(){
	var areacode = $(this).val();
    console.log(areacode);
    var htmlobj=$.ajax({url:"/medical/system/FamilyServlet?method=getchild&areapcode="+areacode,async:false});
    console.log(htmlobj.responseText);
    var areaArr = JSON.parse(htmlobj.responseText);
    document.getElementById("group").length=0;
    for(var i=0;i<areaArr.length;i++){
    	document.getElementById("group").options.add(new Option(areaArr[i].areaname,areaArr[i].areacode));
    }
}

function dispatchEvent(id){
	var event = document.createEvent("HTMLEvents");
	event.initEvent("change", true, true);
	document.querySelector("#"+id).dispatchEvent(event);
}

</script>
</head>
<body>
	
	<div class="panel admin-panel">
		<div class="panel-head" id="add">
			<strong><span class="icon-pencil-square-o"></span>修改家庭档案信息</strong>
		</div>
		<div class="body-content">
			<form method="post" class="form-x"
				action="<%=path%>/system/FamilyServlet?method=edit">
			
		<div class="form-group">
        <div class="label">
          <label>参合家庭编号：</label>
        </div>
        <div class="field">
          <input  type="text" class="input w50" value="<%=family.getFamilycode()%>" name="familycode"  disabled="disabled"/>
          <input  type="text" class="input w50" value="<%=family.getFamilycode()%>" name="familycode"  style="display: none"/>
	    </div>
      </div>		
	    <div class="form-group">
        <div class="label">
          <label>户口属性：</label>
        </div>
        <div class="field">
          <select name="familyattribute" id="familyattribute" required>
         	<option  value="一般户">一般户</option>
            <option  value="五保户">五保户</option>
            <option  value="军烈属">军烈属</option>
          </select>
	    </div>
      </div>
      
  
      
	<div class="form-group">
        <div class="label">
          <label>镇级行政区域：</label>
        </div>
        <div class="field">
        <select name="town" id="town" required>
         	<option style='display: none'></option>
	         <%
	        	List<Area> townlist = a.getListbyLevel(2);
	        	for(int i=0;i<townlist.size();i++){
	        	
	         %>
	         	<option  value="<%=townlist.get(i).getAreacode()%>">
	         	<%=townlist.get(i).getAreaname()%>
	         	</option>
	         <%
	         	}
	          %>       
          </select>
	    </div>
      </div>
      
      <div class="form-group">
        <div class="label">
          <label>村级行政区域：</label>
        </div>
        <div class="field">
        <select name="village" id="village" required>
       		 <option style='display: none'></option>
	         <%
	        	List<Area> villagelist = a.getChildren(family.getTown());
	        	for(int i=0;i<villagelist.size();i++){
	        	
	         %>
	         	<option  value="<%=villagelist.get(i).getAreacode()%>">
	         	<%=villagelist.get(i).getAreaname()%>
	         	</option>
	         <%
	         	}
	          %>     
	          </select>  
	    </div>
      </div>
      
      <div class="form-group">
        <div class="label">
          <label>组级行政区域：</label>
        </div>
        <div class="field">
                <select name="group" id="group" required>
       		 <option style='display: none'></option>
	         <%
	        	List<Area> grouplist = a.getChildren(family.getVillage());
	        	for(int i=0;i<grouplist.size();i++){
	        	
	         %>
	         	<option  value="<%=grouplist.get(i).getAreacode()%>">
	         	<%=grouplist.get(i).getAreaname()%>
	         	</option>
	         <%
	         	}
	          %>     
	          </select>  
	    </div>
      </div>
      
      <div class="form-group">
        <div class="label">
          <label>家庭住址：</label>
        </div>
        <div class="field">
          <input type="text" class="input w50" value="<%=family.getAddress()%>" name="address" data-validate="required:请输入家庭住址" />
	    </div>
      </div>

      <div class="form-group">
        <div class="label">
          <label></label>
        </div>
        <div class="field">
          <button class="button bg-main icon-check-square-o" type="submit"> 提交</button>
        </div>
      </div>

			</form>
		</div>
	</div>

</body>
</html>